<template>
    <div class="accountbinding">
        <div style="display: flex;flex-direction: row;justify-content: center;">
        <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm"
                 class="demo-ruleForm">
            <el-form-item label="当前登录账号：" prop="compname" style="width: 300px">
                <div style="display: flex;flex-direction: row;justify-content: space-around;">
                <el-input v-text="ruleForm.compname"></el-input>
                <el-link type="info" disabled style="width: 200px;">已绑定</el-link>
                </div>
            </el-form-item>
            <el-form-item label="当前手机号码：" prop="phone" style="width: 300px">
                <div style="display: flex;flex-direction: row;justify-content: space-around;">
                <el-input  v-text="ruleForm.compphone" ></el-input>
                <el-link type="danger" style="width: 200px;">立即绑定</el-link>
                </div>
            </el-form-item>
        </el-form>
        </div>
    </div>
</template>

<script>
    export default {
        name: 'accountbinding',
        data(){
            return{
                ruleForm: {
                    compname:'92****232@qq.com',
                    compphone:"155****0981",
                },
            }
        }
    }
</script>


<style scoped>
    .accountbinding{
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }
    .demo-ruleForm{
        margin-top: 5%;

    }
</style>
